<template>
    <div class="page-hire-post">
        <div class="form-handles">
            <span class="btn van-hairline--surround">存入草稿</span>
            <span class="btn van-hairline--surround">发布</span>
        </div>

        <div class="post-form">
            <van-cell-group>
                <van-field class="post-title" v-model="postForm.title" placeholder="请输入标题" />
                <van-field 
                    v-model="postForm.content"
                    type="textarea"
                    rows="10"
                    autosize
                    placeholder="请简单描述您的需求"/>

                <van-field
                    v-model="postForm.money"
                    required
                    clearable
                    label="设计费预算"
                    input-align="right"
                    placeholder="请输入"/>
                <van-field
                    v-model="postForm.money1"
                    required
                    clearable
                    label="截止时间"
                    input-align="right"
                    placeholder="请输入"/>
                <van-field
                    v-model="postForm.money2"
                    required
                    clearable
                    label="缴纳诚意金"
                    input-align="right"
                    placeholder="请输入"/>
                <van-field
                    v-model="postForm.money3"
                    required
                    clearable
                    label="联系人"
                    input-align="right"
                    placeholder="请输入"/>
                <van-field
                    v-model="postForm.money4"
                    required
                    clearable
                    label="联系电话"
                    input-align="right"
                    placeholder="请输入"/>
            </van-cell-group>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            postForm: {
                title: '',
                content: '',
                money: '',
                money1: '',
                money2: '',
                money3: '',
                money4: '',
            }
        }
    }
}
</script>

<style lang="less">
.page-hire-post{
    min-height: 100%;
    background-color: #fff;
    .form-handles{
        padding: 10px 15px;
        text-align: right;
        .btn{
            display: inline-block;
            margin-left: 15px;
            padding: 4px 10px;
            font-size: 13px;
            color: @primary;
            &:after{
                border-color: @primary;
                border-radius: 5px;
            }
        }
    }
    .post-form{
        .van-cell-group{
            &:after{
                display: none;
            }
            .van-cell--required{
                &:before{
                    color: @danger;
                }
            }
        }
        .post-title{
            font-size: 18px;
            padding: 15px;
        }
    }
}
</style>


